<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>行政审批管理平台</title>
  <link rel="stylesheet" href="./style1.css">
</head>

<body>
  <section class="form-box">
    <div class="form-box-image">
      <img src="./image/Snipaste_2025-02-28_22-56-48.png" alt="左侧图片" aria-hidden="true">
    </div>
    <div class="form-box-content">
      <header class="form-header">
        <h1 class="title">行政审批管理平台</h1>
        <div class="radio-inputs">
          <label class="radio">
            <input type="radio" class="user" name="role" value="user" checked aria-label="用户端">
            <span class="name">用户端</span>
          </label>
          <label class="radio">
            <input type="radio" class="manage" name="role" value="manage" aria-label="管理端">
            <span class="name">管理端</span>
          </label>
        </div>
      </header>
      <form class="form" novalidate>
        <div class="form-container">
          <input type="text" class="input" name="count" placeholder="请输入账号" required aria-label="账号输入框">
          <input type="password" class="input" name="password" placeholder="请输入密码" required aria-label="密码输入框">
        </div>
        <footer class="form-footer">
          <label class="checkbox-label">
            <input type="checkbox" class="ui-checkbox" aria-label="记住用户名"><span>记住用户名</span>
          </label>
        </footer>
        <button type="submit" class="login-button">登录</button>
      </form>
    </div>
  </section>

  <script>
    const form = document.querySelector('.form');
    const countInput = document.querySelector('input[name="count"]');
    const passwordInput = document.querySelector('input[name="password"]');
    const uname = document.querySelector('.ui-checkbox');

    window.addEventListener('load', function () {
      const savedUsername = localStorage.getItem('savedUsername');
      if (savedUsername) {
        countInput.value = savedUsername;
        uname.checked = true;
      }
    });

    form.addEventListener('submit', function (e) {
      if (!countInput.value || !passwordInput.value) {
        e.preventDefault();
        alert('请输入账号和密码');
      } else {
        e.preventDefault();
        if (uname.checked) {
          localStorage.setItem('savedUsername', countInput.value);
        } else {
          localStorage.removeItem('savedUsername');
        }
        ToAnotherPage();
      }
    });

    function ToAnotherPage() {
      if (document.querySelector('.manage').checked) {
        window.location.href = "./管理端.html";
      } else {
        window.location.href = "./用户端.html";
      }

    }
  </script>
</body>

</html>